<template>
	<view class="empire-header">
		<view class="empire-card__title">
			<text class="title">{{ title }}</text>
			<slot v-if="$slots.marker" name="marker"></slot>
		</view>
		<view v-if="showAll" class="fontSize-small empire-card__more" @click="handleTextClick">
			<text class="more">{{ showAllText }}</text>
			<uni-icons type="right" size="12"></uni-icons>
		</view>
	</view>
</template>

<script setup>
defineProps({
	title: {
		type: String,
		defaullt: undefined
	},
	showAll: {
		type: Boolean,
		default: false
	},
	showAllText: {
		type: String,
		default: '查看全部'
	}
});
const emits = defineEmits(['header-click']);
function handleTextClick() {
	emits('header-click');
}
</script>

<style lang="scss" scoped>
.empire-header {
	display: flex;
	justify-content: space-between;
	height: 64rpx;
	line-height: 64rpx;
}
.empire-card__title {
	flex: 3;
	display: inline-flex;
	align-items: center;
}
.title {
	font-size: 32rpx;
	margin-right: 30rpx;
}
.empire-card__more {
	flex: 1;
	display: inline-flex;
	justify-content: flex-end;
}
.more {
	margin-right: 4rpx;
	opacity: 0.8;
	&:hover {
		cursor: pointer;
	}
}
</style>